import React, { Component } from 'react';

import Header from '../../core/components/header';
import Table from '../../core/components/table';
import { Post } from '../../core/utils/fetch';
import Dialog from '../../core/utils/dialog';
import {
    Link
} from 'react-router-dom';

class Service extends Component {

    render() {
        let columns = [
            { title: '序号', name: 'id' },
            { title: '姓名', name: 'name' },
            { title: '从业年限', name: 'years' },
            { title: '联系号码', name: 'phone' },
            { title: '星级服务', name: 'starLevel' },
            { title: '操作', render: this.renderOpertion },
        ];
        return (
            <div>
                <Header title="客服管理" subTitle="Service Manage"></Header>
                <Table
                    ref="table"
                    title="客服人员列表"
                    subTitle={<Link to={{ pathname: "/service-edit", query: {} }} className="btn btn-sm btn-primary btn-add">新增</Link>}
                    url="/spi/customerService/list"
                    columns={columns}>
                </Table>
            </div>
        );
    }

    renderOpertion = (dataItem) => {
        return (
            <div>
                <Link to={{ pathname: "/service-edit", search: `?id=${dataItem.id}` }}>编辑</Link>
                {'    '}
                <a onClick={() => this._onDel(dataItem.id)}>删除</a>
            </div>
        );
    };

    _onDel = (id) => {
        Dialog.confirm('你确定要删除吗', () => {
            Post(`/spi/customerService/del/${id}`)
                .then(() => {
                    this._refresh();
                });
        });
    };

    _refresh = () => {
        this.refs.table.refresh();
    };
}

export default Service;